<template>
  <!-- 实施管理 -->
  <base-breadcrumb :title="$route.meta.title">
    <!-- 搜索 -->
    <searchData :searchData="searchArr" @search="search"></searchData>
    <!-- 表格 -->
    <a-card :bordered="false">
      <!-- <title-name :title="$route.meta.title"></title-name> -->
      <!-- 表格 -->
      <list-table
        ref="table"
        tableLayout="fixed"
        size="default"
        rowKey="id"
        :columns="columns"
        :request="loadData"
        :alert="true"
        show-size-changer
        show-quick-jumper
        showPagination="auto"
      >
        <template slot="action" slot-scope="text, record">
          <MoreButton>
          <a v-btnPermission="'di_004_loo_01'" @click="handleManage(0, record)">查看</a>
          <template v-if="record.unitId === $currentPost().id">
            <!-- 方案上报 -->
            <template v-if="record.activityStatus > 0">
              <a v-btnPermission="'di_004_fab_02'" @click="handleManage(3, record)">方案上报</a>
            </template>
            <!-- 过程上报 -->
            <template v-if="record.activityStatus > 1">
              <a v-btnPermission="'di_004_gcb_03'" @click="handleManage(4, record)">过程上报</a>
            </template>
            <!-- 成果上报 -->
            <template v-if="record.activityStatus > 2">
              <a v-btnPermission="'di_004_cgb_04'" @click="handleManage(5, record)">成果上报</a>
            </template>
          </template>
          </MoreButton>
        </template>
      </list-table>
    </a-card>
  </base-breadcrumb>
</template>

<script>
import { STable } from '@/components' // 表格
import { inspCulturalConstructionDeclare } from '@/api/union/workersCongress' // api
import BasePage from '@/views/basePage' // 基础配置
import Selector from '@/components/Select/Selector' // 枚举值

const searchArr = [
  // 搜索框
  {
    name: '申报类型',
    type: Selector,
    valueKey: 'typeId',
    selectType: '7',
    urlType: 'union',
  },
  {
    name: '层级',
    type: Selector,
    valueKey: 'level',
    valueName: 'code',
    selectType: '1',
    urlType: 'union',
  },
  {
    name: '单位',
    value: 'unitName',
    type: 'input',
  },
  {
    name: '联系人',
    type: 'input',
    value: 'name',
  },
  {
    name: '活动状态',
    valueKey: 'activityStatus',
    type: Selector,
    valueName: 'code',
    selectType: '8',
    urlType: 'union',
  },
]
const columns = [
  {
    title: '序号',
    width: 80,
    dataIndex: 'index',
    customRender() {
      return arguments[2] + 1
    },
  },
  {
    title: '申报类型',
    ellipsis: true,
    dataIndex: 'typeName',
  },
  {
    title: '年度',
    ellipsis: true,
    dataIndex: 'year',
  },
  {
    title: '层级',
    ellipsis: true,
    dataIndex: 'levelName',
  },
  {
    title: '单位',
    ellipsis: true,
    dataIndex: 'unitName',
  },
  {
    title: '联系人',
    dataIndex: 'name',
    ellipsis: true,
  },
  {
    title: '联系电话',
    dataIndex: 'phone',
  },
  {
    title: '活动状态',
    dataIndex: 'activityStatusName',
  },
  {
    title: '操作',
    dataIndex: 'action',
    width: '280px',
    align: 'center',
    scopedSlots: { customRender: 'action' },
  },
]
export default {
  name:'a'+ Date.now(),
  extends: new BasePage(),
  components: {
    STable,
  },
  data() {
    this.columns = columns
    this.searchArr = searchArr
    return {
      queryParam: {}, // 查询参数
      loadData: (parameter) => {
        // 添加组织级别和审批通过的参数
        const requestParameters = Object.assign({}, parameter, {
          query: Object.assign({}, { loginLevel: this.$currentPost()?.code, status: 2 }, this.queryParam),
        })
        return inspCulturalConstructionDeclare.getList(requestParameters).then((res) => {
          return res
        })
      }, // 加载数据方法 必须为 Promise 对象
    }
  },
  methods: {
    // 搜索
    search(value) {
      value && (this.queryParam = value)
      this.$refs.table.refresh(true)
    },
    // 操作栏
    handleManage(type, record) {
      let query = {
        editModel: type,
      }
      if (record && record.id) {
        query.id = record.id
      }
      this.$router.push({
        name: '/discipline/integrityCultureConstruction/detail',
        query,
      })
    },
  },
}
</script>

<style lang="less" scoped>
.alert_text {
  color: rgb(238, 146, 9);
}
</style>
